@tailwind base;
@tailwind components;
@tailwind utilities;

/* 给 base 添加样式 */
@layer base {
  h1 {
    @apply text-2xl;
  }
  h2 {
    @apply text-xl;
  }
}

/* 给 components 添加样式*/
@layer components {
  .btn-group {
    & .first-btn {
      margin-right: theme(spacing.6);
    }
  }
}

/* 
  给 utilities 添加样式
  用@layer添加的样式都可作为修饰符
  <div class="lg:dark:content-auto"></div>
*/
@layer utilities {
  .content-auto {
    content-visibility: auto;
  }
}